<!DOCTYPE html>
<html class="x-admin-sm">
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>门店对比</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/xadmin.css">
    <script src="../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/xadmin.js"></script>
    <script src="https://cdn.bootcss.com/echarts/4.6.0/echarts.min.js"></script>
</head>

<body>
<div class="x-nav">
            <span class="layui-breadcrumb">
                <a href="">店铺管理</a>
                <a><cite>门店对比</cite></a>
            </span>
</div>

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <br>


                <div class="layui-card-body ">



                    <fieldset class="layui-elem-field">
                        <legend>多店铺本年度销量一览表</legend>
                        <div class="layui-field-box">





                            <div class="layui-card-body ">
                                <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
                                <div id="main" style="width: 600px;height:400px;"></div>

                                <script type="text/javascript">
                                    // 基于准备好的dom，初始化echarts实例
                                    var myChart = echarts.init(document.getElementById('main'));

                                    var data1 = [];
                                    data1[0]=[[${data10}]];
                                    data1[1]=[[${data11}]];
                                    data1[2]=[[${data12}]];
                                    data1[3]=[[${data13}]];
                                    data1[4]=[[${data14}]];
                                    data1[5]=[[${data15}]];
                                    data1[6]=[[${data16}]];
                                    data1[7]=[[${data17}]];
                                    data1[8]=[[${data18}]];
                                    data1[9]=[[${data19}]];
                                    data1[10]=[[${data110}]];
                                    data1[11]=[[${data111}]];
                                    var data2 = [];
                                    data2[0]=[[${data20}]];
                                    data2[1]=[[${data21}]];
                                    data2[2]=[[${data22}]];
                                    data2[3]=[[${data23}]];
                                    data2[4]=[[${data24}]];
                                    data2[5]=[[${data25}]];
                                    data2[6]=[[${data26}]];
                                    data2[7]=[[${data27}]];
                                    data2[8]=[[${data28}]];
                                    data2[9]=[[${data29}]];
                                    data2[10]=[[${data210}]];
                                    data2[11]=[[${data211}]];
                                    var data3 = [];
                                    data3[0]=[[${data30}]];
                                    data3[1]=[[${data31}]];
                                    data3[2]=[[${data32}]];
                                    data3[3]=[[${data33}]];
                                    data3[4]=[[${data34}]];
                                    data3[5]=[[${data35}]];
                                    data3[6]=[[${data36}]];
                                    data3[7]=[[${data37}]];
                                    data3[8]=[[${data38}]];
                                    data3[9]=[[${data39}]];
                                    data3[10]=[[${data310}]];
                                    data3[11]=[[${data311}]];

                                    // 指定图表的配置项和数据
                                    var option = {
                                        title: {
                                            text: ''
                                        },
                                        tooltip: {
                                            trigger: 'axis'
                                        },
                                        legend: {
                                            data: ['天心店', '岳麓店', '开福店']
                                        },
                                        grid: {
                                            left: '3%',
                                            right: '4%',
                                            bottom: '3%',
                                            containLabel: true
                                        },
                                        toolbox: {
                                            feature: {
                                                saveAsImage: {}
                                            }
                                        },
                                        xAxis: {
                                            type: 'category',
                                            boundaryGap: false,
                                            data: ["January",
                                                "February",
                                                "March",
                                                "April",
                                                "May",
                                                "June",
                                                "July",
                                                "August",
                                                "September",
                                                "October",
                                                "November",
                                                "December"]
                                        },
                                        yAxis: {
                                            type: 'value'
                                        },
                                        series: [
                                            {
                                                name: '天心店',
                                                type: 'line',
                                                stack: '总量',
                                                data: data1
                                            },
                                            {
                                                name: '岳麓店',
                                                type: 'line',
                                                stack: '总量',
                                                data: data2
                                            },
                                            {
                                                name: '开福店',
                                                type: 'line',
                                                stack: '总量',
                                                data: data3
                                            }
                                        ]
                                    };

                                    // 使用刚指定的配置项和数据显示图表。
                                    myChart.setOption(option);
                                </script>
                            </div>

                            <div>
                                <div class="layui-card-body ">
                                <br>
                                <div class="layui-form-item">
                                    <button class="layui-btn layui-btn-primary" lay-submit="" lay-filter="demo2"><a href="/Store/store1" value="岳麓店">岳麓店</a></button>

                                    <button class="layui-btn layui-btn-primary" lay-submit="" lay-filter="demo2"><a href="/Store/store1" value="岳麓店">天心店</a></button>

                                    <button class="layui-btn layui-btn-primary" lay-submit="" lay-filter="demo2"> <a href="/Store/store3" value="开福店">开福店</a></button>
                                </div>
                                </div>
                            </div>
                        </div>
                    </fieldset>

                </div>
            </div>
        </div>
    </div>
</div>
</body>








</html>